<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Users</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        table {
            width: 100%;
            border-collapse: collapse;
            table-layout: auto; /* 让表格根据内容自动调整列宽 */
        }
        th, td {
            border: 1px solid black;
            padding: 8px;
            text-align: left;
        }
        th {
            background-color: #f2f2f2;
        }
        tr:nth-child(even) {
            background-color: #f9f9f9;
        }
        tr:hover {
            background-color: #f1f1f1;
        }
        form {
            margin-top: 20px;
        }
    </style>
</head>
<body>
	<!--显示所有用户信息-->
    <h1>User Data</h1>
    <table>
        <thead>
            <tr>
                {% for column in columns %}
                    <th>{{ column }}</th>
                {% endfor %}
            </tr>
        </thead>
        <tbody>
            {% for row in users_data %}
                <tr>
                    {% for item in row %}
                        <td>{{ item }}</td>
                    {% endfor %}
                </tr>
            {% endfor %}
        </tbody>
    </table>
    <!-- 修改指定表的列-->
    <h2>Update Table</h2>
	<form method="POST" action="/route_admin_display_users">
	    <!--用于区分两个操作-->
		<input type="hidden" name="action" value="update_table">
		<label for="table_name">Select Table:</label>
			<select name="table_name" id="table_name" required>
			{% for table_names in table_name %}
				<option value="{{ table_names }}">{{ table_names }}</option>
			{% endfor %}
			</select>

		<label for="operation">Select Operation:</label>
			<select name="operation" id="operation" required>
				<option value="add">Add Column</option>
				<option value="drop">Drop Column</option>
			</select>

		<label for="column">Column Name:</label>
			<input type="text" id="column" name="column" required>

		<label for="type">Column Type:</label>
        <select name="type" id="type">
            <option value="INT">INT</option>
            <option value="VARCHAR(255)">VARCHAR(255)</option>
            <option value="TEXT">TEXT</option>
            <option value="DATE">DATE</option>
            <option value="DATETIME">DATETIME</option>
            <option value="FLOAT">FLOAT</option>
            <option value="DOUBLE">DOUBLE</option>
            <option value="BOOLEAN">BOOLEAN</option>
            <option value="CHAR(255)">CHAR(255)</option>
        </select>

		<button type="submit">Update</button>
	</form>
	<!-- 修改指定用户值-->
	<h2>Update User Value</h2>
    <form method="POST" action="/route_admin_display_users">
		<!--区分-->
		<input type="hidden" name="action" value="update_user">
        <label for="user_id">User ID:</label>
        <input type="text" id="user_id" name="user_id" required>

        <label for="column_name">Column Name:</label>
        <input type="text" id="column_name" name="column_name" required>

        <label for="new_value">New Value:</label>
        <input type="text" id="new_value" name="new_value" required>

        <button type="submit">Update</button>
    </form>

</body>
</html>
